<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>hxzxCanvas</title>
    <style>
      body {
        margin: 0;
        padding: 0;
      }
      #app {
        width: 100vw;
        height: 100vh;
      }
    </style>
  </head>
  <body>
    <div id="app"></div>
    <script src="./index.umd.js"></script>
    <script>
      // 方案一
      const canvas = new hxzxCanvas("#app");
      // 方案二
      // const canvas = new window.hxzxCanvas("#app");
      console.log(canvas);
      canvas.addControl(
        "rect",
        {
          x: 10,
          y: 10,
          fillStyle: "#e6a23c",
          strokeWidth: 5,
          strokeStyle: "#67c23a",
          dragMove: true,
        },
        {
          width: 100,
          height: 100,
        }
      );
    </script>
  </body>
</html>